import React from 'react';

import Request from '@ajax/index.jsx';
import Tools from '@untils/tools.jsx';
import {APIS_MEET_MANAGE} from '@apis/index.js';
import {meetFilters, meetingType, partyBranch} from '@assets/config/global.js';

import RCTable from '@components/table/index.jsx';
import PageTopFilter from '@components/page_top_filter/index.jsx';
import ParterMeetModal from './parter_meet_modal.jsx';
import RCModal from '@components/modal/index.jsx';

import './scss/index.scss';

const _req = new Request();

class PartyMeet extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            pagination: null,
            list: [],
            pageSize: 10,
            currentPage: 1,

            topic: null,
            time: null,

            // learn_modal
            editModalVisible: false,
            rowData: {},
            showFooter: false,

            //删除弹框
            delModalVisible: false,
            deleteID: ''
        };

        this.setCallback = Tools.setCallback.bind(this);
        this.topFilterForm = null;
        this.submitType = 'edit';
    }

    componentDidMount() {
        this.requestList();
    }

    //请求列表
    requestList() {
        let {pageSize, currentPage, topic, time} = this.state;
        let data = {
            pagination: {
                currentPage: currentPage,
                order: "string",
                orderType: "ACCEPTDATE",
                pageSize: pageSize
            },
            searchContent: {
                topic,time
            }
        };
        let options = Tools.objectAssign(APIS_MEET_MANAGE.MEETLIST, {data});
        _req.ajaxList(options, this);
    }

    //查询
    submitSelect(filtes) {
        this.setCallback({...filtes, currentPage: 1}, this.requestList)
    }

    //table 刷新
    tableRefresh() {
        this.setCallback({topic: null, time: null, currentPage: 1}, this.requestList);
        this.topFilterForm&&this.topFilterForm.resetFields()
    }

    // 行点击
    onRowClick(record) {
        this.setCallback({rowData: record, editModalVisible: true, showFooter: false})
    }


    // 新增按钮
    appendParterMeet() {
        this.submitType = 'append';
        this.setCallback({rowData: {}, editModalVisible: true, showFooter: true})
    }

    // 编辑弹窗保存
    modalSubmitForm(formInfo) {
        this.setCallback({editModalVisible: false}, this.editOrAdd.bind(this, formInfo));
    }

    // 编辑与新增
    editOrAdd(formInfo) {
        let api = null;
        if (this.submitType === 'edit') {
            api = APIS_MEET_MANAGE.EDITMEET;
            formInfo.id = this.state.rowData.id;
        } else {
            api = APIS_MEET_MANAGE.APPENDMEET;
        }
        //formInfo.orgId = "1";
        let options = Tools.objectAssign(api, {data: formInfo});
        _req.axios(options).then(res => this.requestList());
    }

    // 编辑弹窗取消
    modalCancelForm() {
        this.setCallback({rowData: {}, editModalVisible: false});
    }

    // 编辑
    editParterMeetMsg(e, record) {
        e.nativeEvent.stopImmediatePropagation();
        e.stopPropagation();
        this.submitType = 'edit';
        this.setCallback({rowData: record, editModalVisible: true, showFooter: true})
    }

    // 删除
    del(e, id) {
        e.nativeEvent.stopImmediatePropagation();
        e.stopPropagation();
        this.setCallback({deleteID: id, delModalVisible: true})
    }

    // 删除弹框取消
    delCancel() {
        this.setCallback({deleteID: '', delModalVisible: false})
    }

    // 删除框确认
    delSubmit() {
        let options = APIS_MEET_MANAGE.DELETEMEET(this.state.deleteID);
        _req.axios(options).then(res => {
            this.setCallback({deleteID: '', delModalVisible: false}, this.requestList)
        }, err => {

        })
    }

    render() {

        let {
            pagination = null,
            list = [],
            editModalVisible = false,
            rowData = {},
            showFooter = false,
            delModalVisible = false
        } = this.state;

        const columns = [{
            title: '序号',
            key: '序号',
            render: (txt, row, index) => <span>{index + 1}</span>
        }, {
            title: '会议主题',
            dataIndex: 'topic',
            key: 'topic',
            render: (txt) => <p className="ell-1" title={txt || ''}>{txt || '---'}</p>
        }, {
            title: '会议时间',
            dataIndex: 'time',
            key: 'time',
            render: (txt) => <span>{txt || '---'}</span>
        }, {
            title: '会议地点',
            dataIndex: 'site',
            key: 'site',
            render: (txt) => <span>{txt || '---'}</span>
        }, {
            title: '所属党支部',
            dataIndex: 'orgId',
            key: 'orgId',
            render: (txt) => <span>{partyBranch[txt] ? partyBranch[txt].name : '---'}</span>
        }, {
            title: '会议类型',
            dataIndex: 'meetingType',
            key: 'meetingType',
            render: (txt) => <span>{meetingType[txt] ? meetingType[txt].name : '---'}</span>
        }, {
            title: '操作',
            render: (record) => {
                return (
                    <div className="option-btns">
                        <span className="btn-edit btn-item"
                              onClick={(e) => this.editParterMeetMsg(e, record)}>

                        </span>
                        <span className="btn-del btn-item"
                              onClick={(e) => this.del(e, record.id)}>

                        </span>
                    </div>
                )
            }
        }];

        return (
            <div className="party-meet child-wrap">
                <div className="child-main-wrap">
                    <div className="child-main-content">
                        <PageTopFilter
                            title="三会一课"
                            filters={meetFilters}
                            buttons={['查询', '新增']}
                            submitForm={this.submitSelect.bind(this)}
                            // 新增按钮
                            cancelForm={this.appendParterMeet.bind(this)}
                            wrappedComponentRef={node => this.topFilterForm = node}
                        />
                        <RCTable
                            columns={columns}
                            dataSource={list}
                            pagination={pagination}
                            refresh={this.tableRefresh.bind(this)}
                            // 行点击
                            clickRow={this.onRowClick.bind(this)}
                            onChange={(pagination) => {
                                let {selectedRowKeys = [], current: currentPage, pageSize, topic, time} = pagination;
                                this.setCallback({selectedRowKeys, pageSize, currentPage, topic, time}, this.requestList)
                            }}
                        />
                    </div>
                </div>

                {
                    editModalVisible
                        ? <ParterMeetModal
                            modalVisible={true}
                            data={rowData}
                            showFooter={showFooter}
                            submitForm={this.modalSubmitForm.bind(this)}
                            cancelForm={this.modalCancelForm.bind(this)}
                        />
                        : null
                }

                <RCModal
                    title='删除提示'
                    visible={delModalVisible}
                    onOk={this.delSubmit.bind(this)}
                    onCancel={this.delCancel.bind(this)}
                >
                    <p className="del-warning">是否确认删除信息？</p>
                </RCModal>

            </div>
        )
    }
}

export default PartyMeet;